//当页面的DOM结构加载完成之后，执行回调函数中的代码
$(function(){
	//初始化区域滚动
	mui('.mui-scroll-wrapper').scroll({
		deceleration: 0.0005 //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
	});
	//获取一级数据的
	$.ajax({
	url:'/category/queryTopCategory',
	type: 'get',
	success: function(res){
		console.log(res);
		//引入template后，就可以用template方法，（1）HTML模板id，（2）数据，（3）传回result《变量名》
		var html=template('category-first',{result:res.rows});
		$('#links').html(html);
		$('#links').find('a').eq(0).addClass('active');
		
		//获取数据，将ID传给方法，将二级的数据展示出来
		if(res.rows.length){
			var id = res.rows[0].id;
			getSecondData(id);
		}
	}
	});
	//点击A模板，想要获取A模板里的数据
	//1,分类外面的一级标签添加点击事件，而不是模板里的（例如这里是添加在#links这里，添加在a里，就会没有效果）
	//2,在处理函数中获取对应数据,通过属性值，，获取
	//3，调用接口获取数据
//	获取第二级的数据
	$('#links').on('click','a',function(){
		var id = $(this).attr("data-id");
		//当前的元素加一个active类，为同一级别的同元素移除active类的class
		$(this).addClass('active').siblings().removeClass('active');
		getSecondData(id);
		console.log(id);
	});
});

//获取二级分类的数据
function getSecondData(id){
	$.ajax({
			url:'/category/querySecondCategory',
			type:'get',
			data:{
				id: id
			},
			success: function(res){
				console.log(res);				
				var html = template('category-second',{result:res.rows});
				$('#brand-second').html(html);
			}			
		});
}

















